import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:photo_view/photo_view_gallery.dart';
import 'package:xin_he/utils/xin_he_image.dart';

import 'xin_he_photo_gallery_scan_logic.dart';

class XinHePhotoGalleryScanPage extends StatelessWidget {

  // final List imagesList;
  // final int currentIndex;
  final logic = Get.put(XinHePhotoGalleryScanLogic());
  final state = Get.find<XinHePhotoGalleryScanLogic>().state;
  // late PageController sscontroller;

  XinHePhotoGalleryScanPage({Key? key}) : super(key: key){
      // sscontroller = PageController(initialPage: currentIndex);
      // state.currentIndex.value = currentIndex;
  }


  @override
  Widget build(BuildContext context) {
    return Obx(() => Scaffold(
      body: Stack(children: [
        Positioned(
            top: 0,
            right: 0,
            left: 0,
            bottom: 0,
            child: PhotoViewGallery.builder(
              itemCount: state.images.length,
              builder:  (ctx,index){
                return PhotoViewGalleryPageOptions(
                    // imageProvider: AssetImage('assets/images/adopt/bg_${index+1}.png'),
                   imageProvider: NetworkImage(state.images[index]),
                    onTapUp: (ctx,detail,value){
                      state.callbackIndex!(state.currentIndex.value);
                      Get.back();
                   }
                );
              },
              pageController: logic.controller,
              enableRotation: false,
              scrollDirection: Axis.horizontal,
              onPageChanged: (index){
                state.currentIndex.value = index;
              },
            )
        ),

        Positioned(
          top: Get.mediaQuery.padding.top,
          left: 0,
          right: 0,
          child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 5),
            child: Row(children: [
              GestureDetector(
                onTap: (){
                  state.callbackIndex!(state.currentIndex.value);
                  Get.back();
                },
                child: Container(
                  width: 30,
                  height: 30,
                    padding: const EdgeInsets.all(5),

                    decoration: BoxDecoration(color: const Color.fromARGB(100, 255, 255, 255),borderRadius: BorderRadius.circular(15)),
                  child: const Icon(Icons.close,size: 20,color: Colors.white,)
                ),
              ),
              Spacer(),
              Container(
                margin: const EdgeInsets.only(right: 15),
                padding: const EdgeInsets.symmetric(horizontal: 10),
                height: 30,
                alignment: Alignment.center,
                decoration: BoxDecoration(color: const Color.fromARGB(100, 255, 255, 255),borderRadius: BorderRadius.circular(3)),
                child: Text('${state.currentIndex.value+1}/${state.images.length}',style: TextStyle(color: Colors.white,fontSize: 16),),
              ),

            ],),
          ),
        ),



      ],),));
  }
}



